<template>
  <div class="app-container">
    <el-row>
      <el-col :span="24" class="top">
        <Search @handleSearch="handleSearch"></Search>
        <Operate :formData="formData" @operateAction="operateAction" :multipleSelection="multipleSelection"></Operate>
        <Table :formData="formData" :itemList="itemList" @operateAction="operateAction" @handleSelectionChange="handleSelectionChange"></Table>
        <pagination
          style="background: #ffffff; height: 50px"
          v-show="totalSize > 0"
          :total="totalSize"
          :page.sync="page"
          :limit.sync="size"
          @pagination="getItemList"
        />
      </el-col>
    </el-row>
  </div>
</template>

<script>
import {
  findRouterList
} from '@/api/interface/router.js'
import { getItemList, getFormData } from '@/api/interface/operate.js'
export default {
  components: { },
  data() {
    return {
      page: 1,
      size: 20,
      totalSize: 0,
      itemList: [],
      formData: {},
      operateRow: {},
      multipleSelection: [],
      searchParams: {},
    }
  },
  created(){
    this.getItemList()
    this.getFormData()
  },
  methods:{
    handleSearch(searchParams){
      this.searchParams = searchParams
      this.page = 1
      this.getItemList()
    },
    operateAction(operate, val){
      console.log('操作', operate.key, val)
      switch (operate.key) {
        case 'create':
          
          break;
        case 'update':
          break;
    
        default:
            break;
      }
    },
    handleSelectionChange(val){
      this.multipleSelection = val
    },
    getFormData(){
      getFormData({formId: this.$route.meta.formModel.id}).then(res=>{
        if (res.data.code == 10000) {
          this.formData = res.data.data
          // this.$route.meta.fieldList = res.data.data.fieldList
          // this.$route.meta.fieldFormList = res.data.data.fieldFormList
          // this.$route.meta.operateList = res.data.data.operateList
        }
      })
    },
    getItemList() {
      this.searchParams.page = this.page
      this.searchParams.size = this.size
      getItemList(this.$route.meta.formModel.url, this.searchParams).then(res => {
        if (res.data.code == 10000) {
          this.totalSize = res.data.data.total_count
          this.itemList = this.setRouter(res.data.data.list)
          
        }
      });
    },
    // 组装路由数据
    setRouter(routerList){
      var list = []
      routerList.filter(m => {
        var children = []
        routerList.filter(n => {
          if(m.id == n.parent){
            n.meta = {
              'title': n.title,
              'icon': n.icon
            }
            children.push(n)
          }
        })
        if(children.length>0 || m.is_root){
          m.children = children
          m.meta = {
            'title': m.title,
            'icon': m.icon
          }
          list.push(m)
        }
      })
      console.log('list', list)
      return list
    }
  },
}
</script>


<style lang="scss" scoped>

</style>
